$(function () {
  function Is_() {
    this.step = 60;
    this.$second = $('ul.second');
    // console.log(demo);
    console.time('t:');
    for (var i = 0; i < demo.length; i++) {
      var val = demo[i];
      if(i<10)
      $('<li>').html((i+1)+'---'+val.wsid).appendTo('#wrap ul.second');
      else {break;console.timeEnd('t:')};
    }
    $('#wrap ul.first').height(demo.length*this.step)
    var iscroll = new IScroll('#wrap',{
      probeType: 3,
      mouseWheel: true,
      scrollbars: true
    });

    var this_ = this;
    var last_y = 0;
    var stat = {
      in:0,
      out:0
    }
    iscroll.on('scroll',function () {
      var y = this.y;
      var idex = Math.abs(Math.ceil(y/this_.step))+1;//取除以“固定高度”后整数部分绝对值加 “1”. 表示滚出索引号的数组元素
      var idex_ = y%this_.step;
      // console.log(iscroll.directionX);
      if(Math.abs(last_y)<Math.abs(this.y)){//down
        // console.log(Math.abs(idex_)>0+'------===-'+Math.abs(idex_));
        console.log('DOWN------');
        console.log('LI节点数量：'+$('#wrap ul.second').find('li').length);
        if(Math.abs(this.y%this_.step)>0){//未滚出索引号数据元素

          console.log('DOWN------V-');
          this_.$second.css({
            marginTop:(y%this_.step)+'px'
          });
          //和“前次”对比，当前位置索引号和“前次”位置索引号是否相同，相同并且显示元素数等于11时，停止执行
          if(Math.ceil(y/this_.step) == Math.ceil(last_y/this_.step)&&$('#wrap ul.second').find('li').length==11)return;

          // idex_ － － － －
          console.log((y/this_.step) +'==='+ (last_y/this_.step));
          // console.log('undiference');
          var index = Math.abs(idex)+10;
          var next =demo[index];
          if(!next)return;//当前索引数据不存在

          // &&($('#wrap ul.second').find('li').length==11)
          var new_ = $('<li>').html((index)+'-APPENDTO<input value="'+next.task_name+'">--'+next.task_name+'='+next.wsid)
          // new_
          new_.appendTo('#wrap ul.second');
          console.log('===log in ----: insert');
          var len = $('#wrap ul.second').find('li').length;
          if(len>11&&len){
            $('#wrap ul.second').find('li:lt('+(len-11)+')').remove();
          }
        }else{//滚出索引号元素
          if($('#wrap ul.second').find('li').length<=10)return;
            // stat.out++;
            var len = $('#wrap ul.second').find('li').length;
            if(len>11&&len){
              $('#wrap ul.second').find('li:lt('+(len-1)+')').remove();
            }
            $('#wrap ul.second').find('li:first').remove();
            console.log('===log in ----: remove');
            // $('#wrap ul.second').find('li:gt(11)').remove();
            // stat.out =stat.out+$('#wrap ul.second').find('li:gt(11)').length
            // $('#wrap ul.second').find('li:last').remove();
            this_.$second.css({
              marginTop:idex_+'px'
            });
        }
      }else if(Math.abs(last_y)>Math.abs(this.y)){//up
        // console.log(Math.abs(idex_)>0+'------===-'+Math.abs(idex_));
        console.log('LI节点数量：'+$('#wrap ul.second').find('li').length);
        if(Math.abs(this.y%this_.step)>0){
          this_.$second.css({
            marginTop:(y%this_.step)+'px'
          });
          if(Math.ceil(y/this_.step) == Math.ceil(last_y/this_.step))return;
          // idex_
          console.log((y/this_.step) +'==='+ (last_y/this_.step));
          // console.log('undiference');
          var index = Math.abs(idex)+10;
          var next =demo[index];
          stat.in++;
          $('<li>').html((index+1)+'-PREPENDTO--'+next.task_name+'='+next.wsid).prependTo('#wrap ul.second');
          $('#wrap ul.second').find('li:gt(10)').remove();
        }else{
          if($('#wrap ul.second').find('li').length<=10)return;
            // stat.out++;
            $('#wrap ul.second').find('li:gt(11)').remove();
            stat.out =stat.out+$('#wrap ul.second').find('li:gt(11)').length
            // $('#wrap ul.second').find('li:last').remove();
            this_.$second.css({
              marginTop:idex_+'px'
            });
        }
        console.log(JSON.stringify(stat));
      }
      last_y =this.y;
      return;
    })
    iscroll.on('scrollEnd',function () {
      // console.log(this.y);
    })
  }
  Is_.prototype.render = function (y,direction) {
    // y = Math.abs(y);
    console.log('----->>>'+y);
    // var idex = Math.floor(y/this.step);
    return ;
    if(direction==-1){//down

    }else if(direction==1){//up

    }
    $('#wrap ul.second').html('');
    for (var i = idex; i < idex+10; i++) {
      var val = demo[i];
      // if(i<40)
      $('<li>').html((i+1)+'---'+val.wsid).appendTo('#wrap ul');
      // else {break;console.timeEnd('t:')};
    }
  }
  new Is_();
})
